<template>
	<div class="caijin">
		<div class="cai-detail" v-for="item in this.$store.state.caijinNewList">
			<div class="imgerone">
				<img :src="item.thumbnail_pic_s" alt="">
			</div>
			<div class="content">
				<div id="span1">{{ item.title }}</div>
				<div id="span2">{{ item.author_name }} : {{ item.date }}</div>
			</div>
		</div>
	</div>
</template>

<script>
	import { nowNew } from '../libs/getData.js'
	export default {
		name: 'CaiJin',
		mounted() {
			nowNew('caijin')
		}
	}
</script>

<style lang="less" scoped="scoped">
	.caijin{
		width: 100%;
		padding: .44rem 2%;
		.cai-detail{
			width: 100%;
			height: 1.2rem;
			margin-bottom: .15rem;
			.imgerone{
				width: 40%;
				height: 1.2rem;
				overflow: hidden;
				float: left;
				img{
					width: 100%;
					height: 100%;
				}
			}
			.content{
				width: 60%;
				height: 1.2rem;
				float: right;
				padding-left: .2rem;
				#span1{
					width: 100%;
					height: .8rem;
					text-indent: 2em;
				}
				#span2{
					width: 100%;
					height: .4rem;
					overflow: hidden;
					white-space: nowrap;
					text-overflow: ellipsis;
				}
			}
		}
		
	}
</style>